import React, { Component } from 'react'
import { connect } from 'dva';
import { Table } from 'antd';
import {getQueryString} from '@/utils/util';

export interface Props {
  dispatch?: Function,
  children?: React.ReactNode,
  list: {
    data: Array<any>,
    dataCnt: number
  }
}

const ONE_PAGE_SIZE = 10;

@connect()
class CheckIndex extends Component<Props, any> {

  state = {
    current: 1,
    type: getQueryString('type') || '',
    status: getQueryString('status') || ''
  };

  queryData(offset = 1, size = ONE_PAGE_SIZE) {
    const { dispatch } = this.props;
    dispatch({
      type: 'analyse_alarm/queryPage',
      payload: {
        pageNum: offset,
        pageSize: size,
        type: this.state.type,
        status: this.state.status
      },
    });
  }

  initCurrent = () => {
    this.setState({
      current: 1
    })
  };

  componentDidMount() {
    this.queryData();
  }

  render() {
    const { data = [], dataCnt } = this.props.list;
    const ans = data && Array.isArray(data) ? data.map((item, index) => ({
        key: index,
        id: item.id,
        statusName: item.statusName,
        typeName: item.typeName,
        deviceName: item.deviceName,
        deviceLocation: item.deviceLocation,
        deviceTypeName: item.deviceTypeName
      })
    ) : [];
    const pagination = {
      total: dataCnt,
      showTotal: total => `共 ${total} 条`,
      showQuickJumper: true,
      pageSize: ONE_PAGE_SIZE,
      onChange: (current) => {
        this.setState({ current });
        this.queryData(current)
      },
    };
    const columns = [{
      title: '设备名称',
      dataIndex: 'deviceName',
    }, {
      title: '设备类型',
      dataIndex: 'deviceTypeName',
    }, {
      title: '安装位置',
      dataIndex: 'deviceLocation',
    }, {
      title: '报警类型',
      dataIndex: 'typeName',
    }, {
      title: '报警时间',
      dataIndex: 'createTime',
    }, {
      title: '报警状态',
      dataIndex: 'statusName'
    }];
    return (
      <div>
        {/*<Form current={ this.state.current } initCurrent={this.initCurrent} handleExport={this.handleExport}/>*/}
        <Table
          columns={columns}
          pagination={pagination}
          dataSource={ans}
          bordered
        />
      </div>
    );
  }
}

export default CheckIndex;
